<template>
	<view class="withdraw-page d-flex direction-column">
		<view class="d-flex direction-column" v-if="balance.length>0">
			<view class="withdraw-item d-flex align-items-center justify-between" v-for="(item, index) in balance" :key="index">
				<text class="price">{{item.money}}</text>
				<text class="remark">{{item.remark}}</text>
				<text class="time">{{item.add_time}}</text>
			</view>
		</view>
		<view v-else>
			<view class="withdraw-item d-flex align-items-center justify-between" >
				<text class="remark"></text>
				<text class="remark">没有数据 </text>
				<text class="time"></text>
				
			</view>
		</view>
	</view>
</template>

<script>
import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
export default {
	components: {
		uniLoadMore
	},
	data() {
		return {
			headerPosition: 'fixed',
			headerTop: '0px',
			loadingType: 'more', //加载更多状态
			balance: [],
			page:1
		};
	},
	onLoad(options) {
		// #ifdef H5
		this.headerTop = document.getElementsByTagName('uni-page-head')[0].offsetHeight + 'px';
		// #endif
		this.cateId = (0==options.sid)? options.fid:options.sid;
		this.loadData('refresh');
	},
	onPageScroll(e) {
		//兼容iOS端下拉时顶部漂移
		if (e.scrollTop >= 0) {
			this.headerPosition = 'fixed';
		} else {
			this.headerPosition = 'absolute';
		}
	},
	//下拉刷新
	onPullDownRefresh() {
		this.page=1;
		this.loadData('refresh');
	},
	//加载更多
	onReachBottom() {
		if(this.loadingType =='more'){
			this.page=this.page+1;
			this.loadData();
		}
		
	},
	methods: {
		//获取账户明细
		loadData(type='add',loading){
			//const hide = this.$loading('数据加载中...');
			if (type === 'add') {
				if (this.loadingType === 'nomore') {
					return;
				}
				this.loadingType = 'loading';
			} else {
				this.loadingType = 'more';
			}
			let param={
				token:this.token,
				page:this.page
			}
			this.$ajax.get('member/balance',param).then(data=>{
				if(0==data.error){
					let num = data.data.length;
					if(this.page==1){
						if(0==num) this.empty=true;
					}
					if (type === 'refresh') {
						this.balance = data.data;
					}else{
						this.balance = this.balance.concat(data.data);
					}
					this.loadingType = num < 10 ? 'nomore' : 'more';
					if (type === 'refresh') {
						if (loading == 1) {
						} else {
							uni.stopPullDownRefresh();
						}
					}
					//hide();
				}
			})
		},
	}
};
</script>

<style lang="scss">
page {
	background-color: $page-color-base;
}
.withdraw-page {
	input {
		border-bottom: 4rpx solid $base-color;
		padding: 20rpx;
		box-sizing: content-box;
		margin-bottom: 20rpx;
	}
	.submit-btn {
		margin-top: 40rpx;
	}
	.withdraw-box {
		background-color: #ffffff;
		margin-bottom: 30rpx;
		padding: 30rpx;
		padding-top: 10rpx;
		box-shadow: 0 12rpx 40rpx -20rpx rgba($color: #000000, $alpha: 0.15);
	}
	.withdraw-item {
		background-color: #ffffff;
		padding: 20rpx;
		.price {
			font-size: $font-base;
			color: $nav-color-blue;
			line-height: 1;
			&:before {
				content: '￥';
				font-size: 26rpx;
			}
		}
		.remark {
			color: #000000;
			font-size: $font-sm;
		}
		.time {
			color: #999999;
			font-size: $font-sm;
		}
		&:not(:last-child) {
			border-bottom: 1px solid #eee;
		}
	}
}
</style>
